<mat-form-field [appearance]="to.appearance || 'fill'" class="w-full">
  <mat-label>{{ to.label }}</mat-label>
  <!-- 单选不开启搜索 -->
  @if (!to.multiple && !to.search) {
    <mat-select
      disableOptionCentering="true"
      panelClass="custom-select"
      [formControl]="formControl"
      [formlyAttributes]="field"
      disableRipple
      #select
    >
      @if (to && to.none) {
        <mat-option>{{ to.none?.label || '无' }}</mat-option>
      }
      @for (option of matOptions; track option) {
        <mat-option value="{{ option.value }}">{{ option.label }} </mat-option>
      }
    </mat-select>
  }

  <!-- 单选开启搜索 -->
  @if (!to.multiple && to.search) {
    <mat-select
      disableOptionCentering="true"
      panelClass="custom-select"
      [formControl]="formControl"
      [formlyAttributes]="field"
      disableRipple
      #select
    >
      <mat-option>
        <ngx-mat-select-search
          [placeholderLabel]="to.placeholder || '搜索'"
          [noEntriesFoundLabel]="to.noFound || '没有找到'"
          [formControl]="searchCtrl"
        />
      </mat-option>
      @if (to && to.none) {
        <mat-option>{{ to.none?.label || '无' }}</mat-option>
      }
      @for (option of filteredOptions | async; track option) {
        <mat-option [value]="option.value">{{ option.label }} </mat-option>
      }
    </mat-select>
  }
  <!-- 多选不开启搜索 -->
  @if (to.multiple && !to.search) {
    <mat-select
      disableOptionCentering="true"
      panelClass="custom-select"
      [formControl]="formControl"
      [formlyAttributes]="field"
      multiple
      disableRipple
      #select
    >
      @if (to && to.none) {
        <mat-option>{{ to.none?.label || '无' }}</mat-option>
      }
      @for (option of matOptions; track option) {
        <mat-option value="{{ option.value }}">{{ option.label }} </mat-option>
      }
    </mat-select>
  }

  <!-- 多选开启搜索 -->
  @if (to.multiple && to.search) {
    <mat-select
      disableOptionCentering="true"
      panelClass="custom-select"
      [formControl]="formControl"
      [formlyAttributes]="field"
      multiple
      disableRipple
      #select
    >
      <mat-option>
        <ngx-mat-select-search
          [placeholderLabel]="to.placeholder || '搜索'"
          [noEntriesFoundLabel]="to.noFound || '没有找到'"
          [formControl]="searchCtrl"
        />
      </mat-option>
      @if (to.none) {
        <mat-option>{{ to.none?.label || '无' }}</mat-option>
      }
      @for (option of filteredOptions | async; track option) {
        <mat-option [value]="option.value">{{ option.label }} </mat-option>
      }
    </mat-select>
  }
</mat-form-field>
